リンクの作成
ホームページの醍醐味は、リンクのクリックにより次々と関連するページを表示できること。リンクが全く配置されていないホームページなんて、ほとんど見かけません。それほどリンクは重要な要素です。今週はリンクについてお勉強しましょう。

→ 相対パスと絶対パス
 
リンクを知るには、まず“相対パス”と“絶対パス”の違いを理解しなければいけません。“相対パス”とは、現在の位置を基準にリンク先を相対的に指定する方法です。たとえば、現在表示されているページのURLが「http://???.hp.infoseek.co.jp/index.html」であったとしましょう。ここから「http://???.hp.infoseek.co.jp/photo.html」へリンクさせる場合、リンク先の指定は「photo.html」となります。リンク先が「http://???.hp.infoseek.co.jp/photo/index.html」であった場合は「photo/index.html」。つまり、現在の位置(フォルダ)からどうやってリンク先にたどり着くかを指定するのが“相対パス”です。対して“絶対パス”は、「http://www.rakuten.co.jp/」のように「http://」から始まるURLを全て指定する方法となります。

リンク先の指定は“相対パス”と“絶対パス”のどちらを利用しても構いませんが、自分のホームページ内を移動するときは“相対パス”、他人のサイトへリンクするときは“絶対パス”を利用するのが一般的です。なお、“相対パス”で一つ上のフォルダを指定するときは「../」と記述します。この記述方法もあわせて覚えておきましょう。

→ 文字のリンク
 
では、実際にホームページにリンクを作成するにはどうすればよいか? HTMLでは「A」〜「/A」タグを使ってリンクを実現します。具体的には、「A」〜「/A」タグの間に挟まれた項目がリンクとして表示する内容、href属性で指定したパス(相対パスまたは絶対パス)がリンク先、となります。たとえば、文字でリンクを作成する場合の記述方法は以下のようになります。
<HTML>
<HEAD>
  <TITLE>初めてのホームページ!!</TITLE>
</HEAD>

<BODY>
<A href=photo.html>写真のページへ</A><BR>
<A href=http://www.infoseek.co.jp/>infoseekへ</A>
</BODY>

</HTML>


→ 画像のリンク
 
リンクは、文字だけでなく画像で作成することも可能です。この場合、「A」〜「/A」タグの間に「IMG」タグを挟むような構造になります。たとえば、以下のようにHTMLを記述すると画像のリンクを作成できます。なお、リンク用の画像は自動的に青い枠線が表示されます。この枠線を表示したくない場合は、「IMG」タグでborder属性を「0」に指定してください。これで、画像の枠線が表示されなくなります。
<HTML>
<HEAD>
  <TITLE>初めてのホームページ!!</TITLE>
</HEAD>

<BODY>
<A href=photo.html><IMG src=image01.jpg border=0></A><BR>
<A href=http://www.infoseek.co.jp/><IMG src=infoseek.gif border=0></A>
</BODY>

</HTML>


e[NECir Yahoo yV LINEf[^[z500~`I
z[y[W NWbgJ[h COiq@COsI COze